<template>
	<div>
		<div class="down-nav">
			<img class="down-img" src="../../../assets/imges/yuanquan.png" />
			<div class="down-list actives">
				<span class="iconfont icon-xiazai44"></span>
				<p>首页</p>
			</div>
			<router-link to='/missionHall'>
				<div class="down-list">
					<span class="iconfont icon-msnui-task"></span>
					<p>任务大厅</p>
				</div> 
			</router-link>	
 
			<div class="down-list demands">
				<span class="iconfont icon-ego-fav"></span>
				<p>发布需求</p>
			</div>
			<div class="down-list">
				<span class="iconfont icon-msnui-service"></span>
				<p>服务大厅</p>
			</div>
			<div class="down-list">
				<span class="iconfont icon-wode"></span>
				<p>我的</p>
			</div>
		</div>
	</div> 
</template> 
<script>
	export default{
		name:'downNav'
	}
</script>
<style lang="stylus" scoped>
@import '~styles/varibles.styl'
 
 .down-nav{
	 width: 100%;
	 position: relative;
	 height: 1rem;
	 position: fixed;
	 bottom: 0;
	 background: #fff;
 }
 .down-img{
	 width: 100%;
	position: absolute;
	top: -.16rem;
 }
 .down-list{
	 float: left;
	 width: 20%;
	 height: 1rem;
	 color: #707070;
 }  
 .actives{
	 color: $ztcolor;  
 }
 .down-list span{
	 font-size: .48rem;
	 display: block;
	 text-align: center;
	 padding-top: .1rem;
 } 
 .down-list p{
	 padding-top: .1rem;
	 font-size: .24em;
	 text-align: center;
 }
 .demands span{
	 font-size: .65rem;
	 margin-top: -.24rem;
	 color: $ztcolor; 
	 margin-bottom: .085rem;
 }
</style>